<template>
  <el-form ref="editForm" :model="form" label-width="80px" @submit.prevent="onSubmit"
           style="margin:20px;width:60%;min-width:600px;">

    <el-form-item label="农场">
      <div style="width: 300px">
        <input type="text" value="枫泾农场"  :disabled="true" class="el-input__inner" style="display: inline-block;width: 172px">
      </div>
    </el-form-item>
    <el-form-item label="大田块的id">
      <!--<div style="width: 300px">-->
        <!--<input type="text" v-model="form.area_id" class="el-input__inner" style="display: inline-block;width: 172px">-->
      <!--</div>-->
      <template>
        <el-select v-model="form.area_id" placeholder="请选择">
          <el-option
            v-for="item in field"
            :key="item.id"
            :label="item.id"
            :value="item.id">
          </el-option>
        </el-select>
      </template>
    </el-form-item>

    <el-form-item label="种植类型">
      <template>
        <el-select v-model="form.plant_type" placeholder="请选择">
          <el-option
            v-for="item in options"
            :key="item.value"
            :label="item.label"
            :value="item.value">
          </el-option>
        </el-select>
      </template>
    </el-form-item>
    <el-form-item label="所属分组">
      <template>
        <el-select v-model="form.work_group_id" placeholder="请选择">
          <el-option
            v-for="item in group"
            :key="item.id"
            :label="item.name"
            :value="item.id">
          </el-option>
        </el-select>
      </template>
    </el-form-item>
    <el-form-item label="土地状态">
      <template>
        <el-select v-model="form.status" placeholder="请选择">
          <el-option
            v-for="item in status"
            :key="item.value"
            :label="item.label"
            :value="item.value">
          </el-option>
        </el-select>
      </template>
    </el-form-item>
    <el-form-item>
      <el-button type="primary" @click.native="add">立即添加</el-button>
      <el-button @click.native.prevent>取消</el-button>
    </el-form-item>
  </el-form>
</template>

<script type="text/ecmascript-6">
  import { addFields, getAFParam } from '../../api'
  import NProgress from 'nprogress'

  export default {
    data() {
      return {
        form: {
          farm_id: '1',
          area_id: '',
          plant_type: '',
          work_group_id: '',
          status: ''
        },
       options: [{
         value: '0',
         label: '不限'
       }, {
         value: '1',
         label: '藤菜区'
       }, {
         value: '2',
         label: '叶菜区'
       }],
       group: [{
         id: '1',
         name: '一号组'
       }],
       status: [{
         value: '0',
         label: '空闲'
       }, {
         value: '1',
         label: '待支付锁定'
       }, {
         value: '2',
         label: '待种植'
       }, {
         value: '3',
         label: '种植中'
       }, {
         value: '-1',
         label: '待售'
       }],
        field: []
      }
    },
    methods: {
      test() {
        this.$router.push('/plant/index')
      },
      add: function () {
        this.$refs.editForm.validate((valid) => {
          if (valid) {
            this.$confirm('确认提交吗？', '提示', {}).then(() => {
              NProgress.start()
              let para = Object.assign({}, this.form)
              console.log(para)
              addFields(para).then((res) => {
                NProgress.done()
                this.$message({
                  message: '提交成功',
                  type: 'success'
                })
                this.$refs['editForm'].resetFields()
              })
            })
          }
        })
      },
      getParam() {
        let para = this.$route.query
        this.loading = true
        NProgress.start()
        getAFParam(para).then((res) => {
          if (res.s === 1) {
            this.field = res.d.fieldId
            this.group = res.d.group
            NProgress.done()
          }
        })
      }
    },
    created() {
      this.getParam()
    },
    mounted() {}
  }

</script>

<style scoped lang="stylus" rel="stylesheet/stylus">

</style>
